<!--
 * @Author: ljc
 * @Date: 2023-04-27 17:11:02
 * @LastEditors: g05047
 * @LastEditTime: 2023-05-09 20:32:41
 * @Description: 挂接规则
-->

<template>
  <div class="rule-main">
    <div class="rule-left">
      <rk-grid ref="notAssignRef"
        title="待分配规则列表"
        dataUrl="/reviewtask/notAssignRuleList"
        boxConfig
        :params="notAssignQueryParams"
        :columns="tableColumns"
        :pagerConfig="false">
      </rk-grid>
    </div>
    <div class="rule-center">
      <div>
        <el-button @click="handleMove('up')">上移</el-button>
      </div>
      <div>
        <el-button @click="handleMove('down')">下移</el-button>
      </div>
    </div>
    <div class="rule-right">
      <rk-grid ref="assignRef"
        title="已分配规则列表"
        dataUrl="/reviewtask/assignRuleList"
        boxConfig
        :params="assignQueryParams"
        :columns="tableColumns"
        :pagerConfig="false">
      </rk-grid>
    </div>
  </div>
</template>

 <script setup>
import IsUtils from '@/utils/is-utils.js'
import XEUtils from 'xe-utils'
import { EXPERT_SCORE_STATUS } from '@/enums/enums-expert.js'
import { COMMON_STOP_OPEN_ENUMS } from '@/enums/enums-common.js'

const props = defineProps({
  taskDetaileData: { type: [Object], default: () => ({}) }
})

const isAdd = ref(false)
const addTableData = ref([])
const delTableData = ref([])
// 未分配查询参数
let notAssignQueryParams = reactive({
  adCode: '2300',
  taskId: undefined
})
// 已分配查询参数
let assignQueryParams = reactive({
  adCode: '2300',
  taskId: 1111111
})
const notAssignRef = ref(null)
const assignRef = ref(null)

watch(
  () => props.taskDetaileData,
  (newValue, oldValue) => {
    nextTick(() => {
      if (!XEUtils.isEmpty(newValue)) {
        isAdd.value = false
        assignQueryParams.taskId = newValue.value.taskId
        notAssignQueryParams.taskId = newValue.value.taskId
      } else {
        isAdd.value = true
        assignQueryParams.taskId = 111111111
        notAssignQueryParams.taskId = undefined
      }
    })
  },
  { deep: true, immediate: true }
)

const tableColumns = ref([
  {
    field: 'status', title: '启用状态', width: 120, align: 'center', slots: {
      default: ({ row }) => {
        return row.status ? COMMON_STOP_OPEN_ENUMS.options[row.status].label : ""
      }
    }
  },
  { field: 'entryLev1', title: '评审规则名称一级项目名称', width: 250, align: 'left', },
  { field: 'entryLev2', title: '评审规则名称二级项目名称', width: 250, align: 'left', },
  { field: 'reviewDesc', title: '评审内容', width: 250, align: 'left', },
  {
    field: 'scoreType', title: '评审类型', width: 250, align: 'center', slots: {
      default: ({ row }) => {
        return row.scoreType ? EXPERT_SCORE_STATUS.options[row.scoreType].label : ""
      }
    }
  },
  { field: 'reviewStandard', title: '评审标准', width: 120, align: 'center', },
  { field: 'remark', title: '备注', width: 250, align: 'left', },
])
/**上移和下移方法 */
const handleMove = (type) => {
  if (type === 'up') {//上移
    const seleRows = assignRef.value.getCheckboxRecords()
    handleAddRows(notAssignRef, seleRows)
    handleDelRows(assignRef)
    handleGetAssignData(type, seleRows)
  } else if (type === 'down') {// 下移
    const seleRows = notAssignRef.value.getCheckboxRecords()
    handleAddRows(assignRef, seleRows)
    handleDelRows(notAssignRef)
    handleGetAssignData(type, seleRows)
  }
}
// 添加内容
const handleAddRows = (ref, array) => {
  if (array.length) {
    const data = ref.value.getTableData()
    const tableData = data.tableData
    array.forEach(async element => {
      if (!IsUtils.isInclude(tableData, element.pfbzId)) {
        await ref.value.insertAt(element)
      }
    });
  }
}
// 删除内容
const handleDelRows = async (ref) => {
  await ref.value.removeCheckboxRow()
}
// 获取已经分配项目数据
const handleGetAssignData = (type, array) => {
  if (array.length) {
    array.forEach(async element => {
      if (type === 'up') { // 上移
        if (!IsUtils.isInclude(delTableData.value, element.pfbzId)) {
          delTableData.value.push(element)
        }
      } else if (type === 'down') { // 下移
        if (!IsUtils.isInclude(addTableData.value, element.pfbzId)) {
          addTableData.value.push(element)
        }
      }
    });
  }
}

/**获取数据 */
const getRuleData = () => {
  let isVailde = true
  return { addTableData: addTableData.value, delTableData: delTableData.value, isVailde }
}
// 对外暴露方法
defineExpose({
  getRuleData
})
</script>
 <style lang="scss" scoped>
.rule-main {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  .rule-left {
    flex: 1;
    height: 0;
  }
  .rule-center {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 50px;
    div {
      text-align: center;
      margin: 20px;
      .el-button {
        width: 100%;
        padding: 20px;
      }
    }
  }
  .rule-right {
    flex: 1;
    height: 0;
  }
}
</style>